<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>

<body>
<div class="login-form-wrap">
    <h1>黑马程序员</h1>
    <form class="login-form" action="#" id="regist" method="get" autocomplete="off">
        <label>
            <input type="text" id="username" name="username" placeholder="Username..." value="">
        </label>
        <label>
            <input type="password" id="password" name="password" placeholder="Password..." value="">
        </label>
        <input type="submit" value="注册">
    </form>
</div>

</body>
<script>
    document.getElementById("regist").onsumbit = function () {
        //先给form表单注册onsubmit事件
        //判断用户输入的内容是否符合规则：
        //用户名需要是4-16位的字母
        let username = document.getElementById("username").value;
        let regex1 = /^[a-zA-Z]{4,16}$/;
        let flag1 = regex1.test(username);
        if (!flag1) {
            alert("用户名必须是4-16位字母");
            return false;
        }
        //密码需要是6位的数字
        let password = document.getElementById("password").value;
        let regex2 = /^\d{6}$/;
        let flag2 = regex2.test(password);
        if (!flag2) {
    alert("密码必须是6位的数字");
    return false;
        }
        return true
    }
    }


</script>
</html>